import React from 'react'
import {Tabs, WhiteSpace} from 'antd-mobile';
import {connect} from "react-redux";
import {withRouter} from 'react-router-dom'


const Content=()=>{
    console.log("heng")
    return (<div style={{
        display: 'flex',
        alignItems: 'center',
        justifyContent: 'center',
        height: '150px',
        backgroundColor: '#fff'
    }}>
        <p>Content of 123</p>
    </div>);
};
class Demo extends React.Component {
    renderContent = tab => {
        console.log(tab);
        return (<div style={{
            display: 'flex',
            alignItems: 'center',
            justifyContent: 'center',
            height: '150px',
            backgroundColor: '#fff'
        }}>
            <p>Content of {tab.title}</p>
        </div>);
    };


    render() {
        const {dispatch}=this.props;
        const tabs = [
            {title: '1st Tab'},
            {title: '2nd Tab'},
            {title: '3rd Tab'},
            {title: '4th Tab'},
            {title: '5th Tab'},
            {title: '6th Tab'},
            {title: '7th Tab'},
            {title: '8th Tab'},
            {title: '9th Tab'},
        ];

        return (
            <div>
                <button onClick={()=>{
                    dispatch({
                        type:'adsdasd'
                    })
                }}>测试</button>
                <WhiteSpace/>
                <Tabs tabs={tabs}  prerenderingSiblingsNumber={0} >
                    {this.renderContent}
                </Tabs>
                <WhiteSpace/>
            </div>
        );
    }
}

const mapDispatchToProps = (dispatch) => { // 默认传递参数就是dispatch
    return {
        dispatch
    };
};
export default connect((state) => ({
    order: state.order,
    product: state.product,
}), mapDispatchToProps)(withRouter(Demo))
